.progress {
  position: relative;
  width: 100%;
  height: 10px;
  background-color: greenyellow;
  border-radius: 8px;

  .current-progress {
    position: relative;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    width: 10%;
    height: 100%;
    background-color: red;
    border-radius: 8px;

    .icon-round {
      position: absolute;
      top: 50%;
      right: -8px;
      z-index: 3;
      width: 16px;
      height: 16px;
      cursor: pointer;
      background-color: yellow;
      border-radius: 50%;
      transform: translateY(-50%);
    }

    .icon-loading {
      position: absolute;
      top: 50%;
      right: -6px;
      z-index: 5;
      width: 12px;
      height: 12px;
      background: url('@/assets/image/music-audio/loading.gif');
      transform: translateY(-50%);
    }
  }

  .cache-progress {
    position: absolute;
    top: 0;
    left: 0;
    width: 30%;
    height: 100%;
    background-color: #ccc;
    border-radius: 8px;
  }

  .total-progress {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
  }
}
